<template>
  <div class="home">
    <Header></Header>
    <div class="container">
      <h2>简约而不简单</h2>
      <h1>可拖拽式在线简历制作平台</h1>
      <hr class="split-line" />
      <el-button @click="gotoResumeView">开始制作简历</el-button>
    </div>
  </div>
</template>

<script>
// @ is an alias to /src
import Header from '@/components/Header.vue'
export default {
  name: 'HomeView',
  components:{
    Header
  },

  methods: {
    gotoResumeView() {
      this.$router.push('templates')
    },
  },
}
</script>

<style lang="less" scoped>
h1 {
  font-size: 72px;
}
.split-line {
  width: 140px;
  height: 5px;
  background-color: #89836d;
  border-radius: 5px;
  border: none;
}

.container {
  background-color: #b6dfd3;
  padding: 30px 0;
  text-align: center;
}

.el-button {
  background-color: #2f68b7;
  color: #ccc;
}
</style>
